<template>
	<div id="all">
		<div id="">当前时间：{{ time }}</div>
		<div id="">文献地址：http://momentjs.cn/docs/#/use-it/browser/</div>
		
		<div id="table">
			<el-table :data="tableData" height="100%" border stripe style="width: 100%">
				<el-table-column prop="str" label="格式"></el-table-column>
				<el-table-column prop="value" label="返回值"></el-table-column>
			</el-table>
		</div>
	</div>
</template>

<script>
export default {
	name: 'momentDemo',
	data() {
		return {
			time: '',
			tableData: []
			// now:this.$moment()
		};
	},
	mounted() {
		this.time = this.$moment(new Date()).format('YYYY/MM/DD HH:mm:ss');
		this.init();
	},
	methods: {
		init() {
			let me = this;
			var day = new Date(2011, 9, 16);
			var a = this.$moment([2007, 0, 28]);
			var b = this.$moment([2007, 0, 29]);
			me.tableData.push({ str: "moment(2021-11-01 15:29:45).format('YYYY/MM/DD HH:mm:ss')", value: this.$moment('2021-11-01 15:29:45').format('YYYY/MM/DD HH:mm:ss') });
			me.tableData.push({ str: "moment(new Date()).format('YYYY/MM/DD HH:mm:ss')", value: this.$moment(new Date()).format('YYYY/MM/DD HH:mm:ss') });

			me.tableData.push({ str: "moment().format('YYYY') 4 或 2 位数字的年份", value: this.$moment().format('YYYY') });
			me.tableData.push({ str: "moment().format('YY') 2 位数字的年份 ", value: this.$moment().format('YY') });
			me.tableData.push({ str: "moment().format('Y') 带有任意数字和符号的年份", value: this.$moment().format('Y') });
			me.tableData.push({ str: "moment().format('Q') 年份的季度。将月份设置为季度的第一个月", value: this.$moment().format('Q') });
			me.tableData.push({ str: "moment().format('MM') 月份数字", value: this.$moment().format('MM') });
			me.tableData.push({ str: "moment().format('MMMM') 语言环境中的月份名称", value: this.$moment().format('MMMM') });
			me.tableData.push({ str: "moment().format('DD') 月的某天", value: this.$moment().format('DD') });
			me.tableData.push({ str: "moment().format('Do') 月的某天，带序数", value: this.$moment().format('Do') });
			me.tableData.push({ str: "moment().format('DDDD') 年的某天", value: this.$moment().format('DDDD') });

			me.tableData.push({ str: "moment().format('HH	') 小时0..23（24 小时制）", value: this.$moment().format('HH') });
			me.tableData.push({ str: "moment().format('hh	') 小时（使用 a A 的 12 小时制）", value: this.$moment().format('hh') });
			me.tableData.push({ str: "moment().format('kk	') 小时（从 1 到 24 的 24 小时制）", value: this.$moment().format('kk') });
			me.tableData.push({ str: "moment().format('a或A') 上午或下午（单一字符 a p 也被视为有效）", value: this.$moment().format('a') });
			me.tableData.push({ str: "moment().format('mm	') 分钟", value: this.$moment().format('mm') });
			me.tableData.push({ str: "moment().format('ss	') 秒钟", value: this.$moment().format('ss') });
			me.tableData.push({ str: "moment().format('SSS') 	带分数的秒钟", value: this.$moment().format('SSS') });

			me.tableData.push({ str: "moment().format('X') Unix 时间戳", value: this.$moment().format('X') });
			me.tableData.push({ str: "moment().format('x') Unix 毫秒时间戳", value: this.$moment().format('x') });
			me.tableData.push({ str: "moment().format('ww') 语言环境的年的第几周", value: this.$moment().format('ww') });
			me.tableData.push({ str: "moment().format('E') 语言环境的星期几", value: this.$moment().format('E') });
			me.tableData.push({ str: "moment().format('dddd') 语言环境的星期几的名称", value: this.$moment().format('dddd') });
			me.tableData.push({ str: "var day = new Date(2011, 9, 16) moment(day).format('YYYY/MM/DD')", value: this.$moment(day).format('YYYY/MM/DD') });

			me.tableData.push({
				str: 'moment().seconds(30).valueOf() === new Date().setSeconds(30);',
				value: this.$moment()
					.seconds(30)
					.valueOf()
			});

			me.tableData.push({ str: 'moment().millisecond(Number); Number:接受 0 到 999 之间的数字', value: this.$moment().millisecond() });

			me.tableData.push({ str: 'moment().second(Number); Number:接受 0 到 59 之间的数字', value: this.$moment().second() });
			me.tableData.push({ str: 'moment().minute(Number); Number:接受 0 到 59 之间的数字', value: this.$moment().minute() });
			me.tableData.push({ str: 'moment().hour(Number); Number:接受 0 到 23 之间的数字', value: this.$moment().hour() });
			me.tableData.push({ str: 'moment().date(Number); Number:接受 1 到 31 之间的数字', value: this.$moment().date() });
			me.tableData.push({ str: 'moment().day(Number); Number:设置星期几，其中星期日为 0、星期六为 6。', value: this.$moment().day() });
			me.tableData.push({
				str: 'moment().day(-7).format("YYYY/MM/DD HH:mm:ss"); // 上个星期日 (0 - 7)',
				value: this.$moment()
					.day(-7)
					.format('YYYY/MM/DD HH:mm:ss')
			});

			me.tableData.push({ str: 'mmoment().quarter(); 返回1~4 季度', value: this.$moment().quarter() });
			me.tableData.push({
				str: 'moment().add(7, "d"); 之后第七天',
				value: this.$moment()
					.add(7, 'd')
					.format('YYYY/MM/DD HH:mm:ss')
			});
			me.tableData.push({
				str: 'moment().add(Number, "str"); Number:增加多少时间 str：years y quarters	Q months M weeks	w days	d hours	h minutes	m seconds	s milliseconds	ms',
				value: this.$moment()
					.add(10, 'HH')
					.format('YYYY/MM/DD HH:mm:ss')
			});
			me.tableData.push({ str: 'moment().add({days:7,months:1}).format("YYYY/MM/DD HH:mm:ss"); // 对象字面量', value: this.$moment().add({days:7,months:1}).format("YYYY/MM/DD HH:mm:ss") });
			me.tableData.push({ str: 'moment([2007, 0, 29]).fromNow(true);  ', value: this.$moment([2007, 0, 29]).fromNow(true) });
			me.tableData.push({ str: 'moment([2007, 0, 29]).fromNow();  ', value: this.$moment([2007, 0, 29]).fromNow() });
			me.tableData.push({ str: 'moment().add(7, "d").fromNow();  ', value: this.$moment().add(7, "d").fromNow() });
			me.tableData.push({ str: 'moment().add({days:16,months:1}).fromNow();  ', value: this.$moment().add({days:16,months:1}).fromNow() });
			me.tableData.push({ str: 'var a = moment([2007, 0, 28]);var b = moment([2007, 0, 29]);a.to(b); ', value: a.to(b) });
			me.tableData.push({ str: 'b.diff(a) 要获取以毫秒为单位的差异', value: b.diff(a) });
			me.tableData.push({ str: "moment().valueOf(); 简单地输出自 Unix 纪元以来的毫秒数", value: this.$moment().valueOf() });
			me.tableData.push({ str: "moment().daysInMonth(); 获取当月的天数。", value: this.$moment().daysInMonth() });
		me.tableData.push({ str: "moment('2012-02', 'YYYY-MM').daysInMonth(); 获取指定月的天数。", value: this.$moment('2012-02', 'YYYY-MM').daysInMonth() });
		me.tableData.push({ str: "moment().toObject(); 这会返回一个包含年份、月份、月份的日期、小时、分钟、秒钟、毫秒的对象。", value: this.$moment().toObject() });
		console.log("moment().toObject()", this.$moment().toObject())
		
		me.tableData.push({ str: 'var m = moment(); m.get("y"); 快捷显示对应  时间格式内容', value:  this.$moment().get("y") });
		me.tableData.push({ str: 'var m = moment(); m.get("M"); 快捷显示对应  时间格式内容', value:  this.$moment().get("M") });
		me.tableData.push({ str: 'var m = moment(); m.get("D"); 快捷显示对应  时间格式内容', value:  this.$moment().get("D") });
		me.tableData.push({ str: 'var m = moment(); m.get("H"); 快捷显示对应  时间格式内容', value:  this.$moment().get("H") });
		me.tableData.push({ str: 'var m = moment(); m.get("m"); 快捷显示对应  时间格式内容', value:  this.$moment().get("m") });
		me.tableData.push({ str: 'var m = moment(); m.get("s"); 快捷显示对应  时间格式内容', value:  this.$moment().get("s") });

		}
	}
};
</script>

<style scoped="scoped">
#all {
	width: 100%;
	height: 100%;
	background-color: #fff;
}
.mgL20 {
	margin-left: 20px;
}
.mgL10 {
	margin-left: 10px;
}
.mgL30 {
	margin-left: 30px;
}
#table {
	margin: 0 auto;
	max-width: 1000px;
	min-width: 400px;
}
</style>
